﻿<%@ page language="java" pageEncoding="UTF-8"
	errorPage="/ui/defaultException.jsp"%>
<%@include file="/ui/tags.jsp"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
     <title>添加想去的地方--行程--禅境旅行</title>
    <meta http-equiv="content-type" content="text/html; charset=utf-8" />
    <%@include file="/ui/portal/commonjscss.jsp"%>
</head>
<body>
    <div class="page">
        <%@include file="/ui/portal/head.jsp"%>
        <div id="container" class="container margin10">
            <div class="trip-area-title">
                只要花费三分钟时间，就可以制作自己的个性化旅行计划</div>
            <div class="trip-area-step">
                <div class="trip-area-step-prev">
                    <a href="javascript:void(0)">上一步</a>
                </div>
                <c:set value="2" var="step"></c:set>
				<%@include file="/ui/portal/trip/edit_steps.jsp"%>
                <div class="trip-area-step-next">
                    <a href="javascript:void(0)">下一步</a>
                </div>
            </div>
            <div id="table" class="trip-area-have2">
            	<c:forEach var="daily" items="${tripDailys }">
            	<div id="row" class="select trip-area-have2-row" data-daily_id="${daily.dailyId}" data-daily_no="${daily.dailyNo }">
                    <div class="trip-area-have2-rowinner ">
                        <div id="col1" class="item1 trip-area-have-days-title">
                        </div>
                        <div id="col2" class="trip-area-have-days-info">
                            <ul>
                            	<c:forEach var="loc" items="${daily.tripDailyLocations }">
                            		<li data-daily_location_id = "${loc.dailyLocationId }" 
                            			data-location_id = "${loc.locationId }"
                            			data-tripdest_id="${loc.tripdestId }">${loc.locationName }</li>
                            	</c:forEach>
                            </ul>
                        </div>
                    </div>
                </div>
            	</c:forEach>
                <div class=" clear1">
                </div>
                <div class="trip-area-menu2">
                    <ul>
                    	<c:forEach var="tripdest" items="${tripTripdests }">
                    		<li>
                    		<a href="javascript:void(0)" data-tripdest_id="${tripdest.tripdestId }" 
                    			data-lat="${tripdest.lat }"
                    			data-lng="${tripdest.lng }">${tripdest.destName }</a>
                            <div class="trip-area-menu2-submenu">
                            </div>
                        	</li>
                    	</c:forEach>
                        
                    </ul>
                </div>
            </div>
           <div class="trip-area-maopcontrol">
                <div class="trip-area-maopcontrol-button">
                    <a class="ac" href="javascript:void(0)">自定义地点</a>
                </div>
            </div>
            <div class="trip-area-map" style="display: none;">
             <div class="trip-area-map-info"></div>
                <div class="trip-area-map-search">
                    <input id="address" class="searchinput" type="textbox" placeholder="请输入要自定义的目的地名称">
                    <input id="query" type="button" value="查询" class="searchinputbutton">
                    <input id="bound" type="button" value="选择区域" class="searchinputbutton boderleftnone" onclick="bound()">
                    <input id="clearBound" type="button" value="清除区域" class="searchinputbutton boderleftnone borderrightnone"
                        onclick="clearBound()">
                </div>
            </div>
            <div class="trip-area-list">
            </div>
            <div class=" clear1">
            </div>
        </div>
        <%@include file="/ui/portal/footer.jsp"%>
    </div>
    <script src="http://maps.googleapis.com/maps/api/js?key=AIzaSyBXF4z-R35SvrcxQNsQJUd6JIs4X1fAoZw&sensor=false&libraries=places,drawing&hl=zh-CN"></script>
	<script src="${cpath}/resources/portal/js/jquery.json-2.4.min.js" type="text/javascript"></script>
	<script src="${cpath}/resources/portal/js/trip.js" type="text/javascript"></script>
	<script type="text/javascript">
	$(function(){
		TripAPI.init("${cpath}");
		var tripdaily;
		var map = $(".trip-area-map-info").tripmap({
			search:{
			input:"#address",
			submit:"#query",
			bound:"#bound",
			clearBound:"#clearBound"
		},
		drawenable:true,
		addPlace:function(data){
			var destData = tripdaily.selectedDest;
			if (!destData){
				alert("未选择目的地");
			}
			this.closeWindow();
			var cdata = {
					tripdest_id:destData.tripdest_id,
					location_name:data.name,
					lat:data.geometry.location.lat(),
					lng:data.geometry.location.lng(),
					google_id:data.id,
					google_reference:data.reference
			};
			if (tripdaily){
				tripdaily.insertColumn(cdata);
			} else{
				alert("页面正在初始化中...");
			}
			
		}});
		$(".trip-area-maopcontrol-button a").triptoggle({
			one:function(){
				$(".trip-area-map").show();
				map.show();
			},
			two:function(){
				$(".trip-area-map").hide();
			}
		});
		tripdaily = $(window).tripdaily({
			changeDest:function(dest){
				map.setCenter(dest);
			}
		});
		$(".trip-area-step-prev a").click(function(){
			if (tripdaily.isEdited()){
				tripdaily.submit(false,'${trip.tripId}');
			} else {
				window.location.href = "${cpath}/trip/edit/add-destination?tid=${trip.tripId}";
			}
			
		});
		$(".trip-area-step-next a").click(function(){
			if (tripdaily.getRowSize() <= 0){
				alert("必须要有一天的行程");
			}
			if (tripdaily.isEdited()){
				tripdaily.submit(true,'${trip.tripId}');
			} else {
				window.location.href = "${cpath}/trip/edit/sort?tid=${trip.tripId}";
			}
		});
	});
	</script>
</body>
</html>
